<template>
  <div class="super-user-center-container menu-container">
    <el-card>
      <el-tabs v-model="activeName" tab-position="left">
        <el-tab-pane label="个人资料" name="info">
          <super-user-info v-if="activeName === 'info'" />
        </el-tab-pane>
        <el-tab-pane label="安全中心" name="safe">
          <safe-center v-if="activeName === 'safe'" />
        </el-tab-pane>
      </el-tabs>
    </el-card>
  </div>
</template>

<script>
import SafeCenter from './components/SafeCenter'
import SuperUserInfo from './components/SuperUserInfo'
export default {
  name: 'SuperUserCenter',
  components: { SuperUserInfo, SafeCenter },
  props: {},
  data () {
    return {
      activeName: 'info'
    }
  },
  computed: {},
  watch: {},
  created () {
  },
  mounted () {},
  methods: {
  }
}
</script>

<style scoped lang="scss">
.super-user-center-container {
  height: 95%;
  ::v-deep .el-card {
    height: 100%;
    margin: 15px 0 15px 15px;
    .el-tabs__item {
      color: var(--main-color);
      &:hover {
        color: #007fff;
      }
    }
  }
}
</style>
